<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>宜鲜生</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <!-- load css -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css?v=v3.3.7" media="all">
    <link rel="stylesheet" type="text/css" href="css/font/iconfont.css?v=1.0.0" media="all">
    <link rel="stylesheet" type="text/css" href="css/layui.css?v=1.0.9" media="all">
    <link rel="stylesheet" type="text/css" href="css/jqadmin.css?v=1.3.4" media="all">

</head>
<body>

<div class="container-fluid larry-wrapper">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
        <section class="panel panel-padding" style="margin-top: 30px;">
        <form class="layui-form layui-form-pane" method="post" action="/education/admin/user/update" id="form">
            <input type="hidden" name="id">
            <!--<div class="layui-form-item">
                <label class="layui-form-label">部门</label>
                <div class="layui-input-inline">
                    <input type="hidden" name="departmentids" >
                    <input type="text" name="deptnames"  class="layui-input " readonly>
                </div>
                <a class="layui-btn" onclick="beforeChoice();">
                    <i class="iconfont">&#xe649;</i> 选择
                </a>
            </div>
-->
            <div class="layui-form-item">
                <label class="layui-form-label">账号</label>
                <div class="layui-input-inline">
                    <input type="text" name="username" autocomplete="off" class="layui-input ">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <input type="password" name="password" autocomplete="off" class="layui-input ">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">昵称</label>
                <div class="layui-input-inline">
                    <input type="text" name="name" placeholder="姓名" autocomplete="off" class="layui-input ">
                </div>
            </div>

           <!-- <div class="layui-form-item">
                <label class="layui-form-label">所属角色</label>
                <div class="layui-input-inline">
                    <select name="roleid">
                        <option value="Admin">管理员</option>
                        <option value="AssociateInspector">协会巡查员</option>
                        <option value="StreetInspector">街道巡查员</option>
                        <option value="EpUser">企业用户</option>
                    </select>
                </div>
            </div>-->

            <div class="layui-form-item">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                    <input type="radio" name="sex" title="男" value="1" />
                    <input type="radio" name="sex" title="女" value="0" />
                    <input type="radio" name="sex" title="未知" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机</label>
                <div class="layui-input-inline">
                    <input type="text" name="mobile" placeholder="手机号码" jq-verify="phone" jq-error="格式不正确"
                           autocomplete="off" class="layui-input ">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">上传头像</label>
                <div class="layui-input-block">
                    <input type="file" name="file" class="layui-upload-file" id="img">
                    <input type="hidden" name="img" error-id="img-error">
                    <p id="img-error" class="error"></p>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">状态</label>
                <div class="layui-input-inline">
                    <input type="radio" name="status" title="启用" value="1" checked />
                    <input type="radio" name="status" title="禁用" value="0" />
                </div>
            </div>


            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" jq-submit jq-filter="submit">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
        </section>
    </div>
</div>
</div>
</body>
<script src="js/layui/layui.js"></script>
<script type="text/javascript" src="js/lib/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/lib/rest.js"></script>
<!--#include file="common/version.html"-->
<script>

    layui.use(['jquery', 'jqform','upload'], function(exports){
        var form = layui.jqform;
        layui.upload({
            elem:'#img',
            url: '/education/api/image/user',
            before: function(input) {
                box = $(input).parent('form').parent('div').parent('.layui-input-block');
                if (box.next('div').length > 0) {
                    box.next('div').html('<div class="imgbox"><p>上传中...</p></div>');
                } else {
                    box.after('<div class="layui-input-block"><div class="imgbox"><p>上传中...</p></div></div>');
                }
            },
            success: function(res) {
                if (res.code == 200) {
                    box.next('div').find('div.imgbox').html('<img src="/education' + res.data[0].url + '" alt="..." class="img-thumbnail">');
                    box.find('input[type=hidden]').val(res.data[0].url);
                    form.check(box.find('input[type=hidden]'));
                } else {
                    box.next('div').find('p').html('上传失败...')
                }
            }
        });
    });

    $(function(){
       restGet('/education/admin/user/view', null, $('#form'), function(rs){
           $('input[name=password]').val('');
           if(rs.status == 200){
               if($.cookie('nickname') != rs.data.name){
                   $.cookie('nickname', rs.data.name);
                   top.$('#nickname').text(rs.data.name);
               }
               //show image
               _showImg('img', rs.data.img);
              /* restPost('/education/admin/dept/view/' + rs.data.departmentids, null, function(r){
                    if(r.status == 200 && r.data){
                        $('input[name="deptnames"]').val(r.data.names);
                    }
               })*/
           }
       })
    });

    var _showImg = function(k, q){
        var arr = q.split(',');
        var content ='';
        for(var i=0; i< arr.length; i++){
            var _url = arr[i];
            var str =  '<img name="file" src="{src}" class="img-thumbnail" style="height:200px;">';
            str = str.replace(/{src}/g, '/education'+_url);
            str = '<span class="layer-photos-demo">' + str + '</span>';
            //str +=
                    '<a style="cursor: pointer;margin-right: 50px;" onclick="delImg(this)"><span class="layui-icon" style="color: red;font-size: xx-large;vertical-align:top;">&#x1006;</span></a>'
            content += '<span>' + str + '</span>';
        }
        var rs = '<div class="imgbox" style="height: 200px;">'+content+'</div>';
        $('input[name='+k+']').parent().after(rs);
    };

    function delImg(obj){
        var input = $(obj).parent().parent().prev().find('input[type=hidden]');
        if($(obj).parent().parent().children('span').length == 1){
            input.val('');
            input.prev().val('');//两张图片的处理
            $(obj).parent().parent().remove();
        } else {
            var v = $(obj).prev().find('img').attr('src').replace('/education', '');
            //先处理两张图片的情况
            if(input.prev('input').length >0){
                if(v == input.prev('input').val()){
                    input.prev('input').val('');
                }else{
                    input.val('');
                }
            } else {
                var s = input.val().replace(','+ v, '')
                        .replace(v +',', '');
                input.val(s);
            }
            $(obj).parent().remove();
        }
    }

    /*function choiceDept(item){
        var $ = layui.jquery;
        $('input[name="departmentids"]').val(item.id);
        $('input[name="deptnames"]').val(item.name);
    }

    function beforeChoice(){
        var index = layer.open({
            type: 2,
            content: "module/dept-tree.html", "title": "选择部门", "area": ['500px', '600px'], "maxmin":"true"
        });
    }*/

</script>

</html>